
<link href="../addons/jy_invitation/css/web.css?v=20170728" rel="stylesheet" type="text/css"/>
<link rel="stylesheet" type="text/css" href="../core/resource/css/jinyunicon.css">


<div class="page-content">
    <div class="page-toolbar" style="margin-bottom:10px">
        <a class="btn btn-default " ng-click="access_json('jy_invitation/list/')">返回列表</a>
    </div>
	<div class="flex">
		<div class="col-jy" style="width:350px;">
		<div class="diy-phone">
			<div class="phone-head"></div>
			<div class="phone-body">
				<div class="phone-title" id='yqk' >邀请卡</div>
				<div class="phone-main">
					<img class="card-bg" ng-src="{{tomedia(pagedata.images)}}" />
					<div id="phone">
					<div id="phone">
						<img class="headimg" src="../addons/jy_invitation/images/customer.jpg">
						<img class="qrcode" src="../addons/jy_invitation/images/baidu.png">
						<div class="nickname">曾小云</div>
						<div class="sharetext">{{pagedata.item.text1||'向你推荐了一个商城'}}</div>
						<div class="cardtitle">{{pagedata.item.text2 || pagedata.setting.title +' · 一个特好用的商城'}}</div>
						<div class="cardname">{{pagedata.item.text3 || '如何做一个好的商城？'}}</div>
						<div class="descname">{{pagedata.item.text4 || '商城简介'}}</div>
						<div class="desctext"><p>{{pagedata.item.text5}}</p></div></div>
					</div>
				</div>
			</div>
			<div class="phone-foot"></div>
		</div>
		</div>
		<div class="col-jy" style="width:100%;">
		<div class="form-horizontal modal-edit">
			 <div class="form-group">
				<div class="col-md-10">
					<div class="input-group">
							<span class="input-group-btn">
									<button class="btn btn-primary" type="button" ng-click="post({},'jy_invitation/post/qc/id='+pagedata.item.id)">清空邀请卡缓存</button>
							</span>
					</div>
					<div class="help-block">清空邀请卡缓存，已生成过海报才会刷新！</div>
				</div>
			</div>
			 <div class="form-group">
				<div class="col-sm-2 control-label">邀请卡名称</div>
				<div class="col-sm-10">
					<input class="form-control input-sm diy-bind" placeholder="请输入名称"  ng-change="change();"  ng-model="pagedata.item.title" data-bind="title" />
					<div class="help-block">提示：邀请卡名称将会显示在手机端，请规范填写</div>
				</div>
			</div>
			<div class="form-group">
				<div class="col-sm-2 control-label">第一行文字</div>
				<div class="col-sm-10">
					<input class="form-control input-sm diy-bind" placeholder="请输入第一行文字" ng-change="change();" ng-model="pagedata.item.text1" data-bind="title" />
					
				</div>
			</div>
			<div class="form-group">
				<div class="col-sm-2 control-label">第二行文字</div>
				<div class="col-sm-10">
					<input class="form-control input-sm diy-bind" placeholder="请输入第二行文字" ng-change="change();" ng-model="pagedata.item.text2" data-bind="title" />
					
				</div>
			</div>
			<div class="form-group">
				<div class="col-sm-2 control-label">第三行文字</div>
				<div class="col-sm-10">
					<input class="form-control input-sm diy-bind" placeholder="请输入第三行文字" ng-change="change();" ng-model="pagedata.item.text3" data-bind="title" />
					
				</div>
			</div>
			<div class="form-group">
				<div class="col-sm-2 control-label">第四行文字</div>
				<div class="col-sm-10">
					<input class="form-control input-sm diy-bind" placeholder="请输入第四行文字" ng-change="change();" ng-model="pagedata.item.text4" data-bind="title" />
					
				</div>
			</div>
			<div class="form-group">
				<div class="col-sm-2 control-label">第五行文字</div>
				<div class="col-sm-10">
					<textarea style="height:200px;" class="form-control " ng-model="pagedata.item.text5" cols="50"></textarea>					
				</div>
			</div>
			<div class="form-group">
				<div class="col-sm-2 control-label">邀请卡状态</div>
				<div class="col-sm-10">
					<label class="radio-inline"><input type="radio" name="status" ng-checked="pagedata.item.status==1" class="diy-bind" data-bind="status" checked="checked"> 启用</label>
					<label class="radio-inline"><input type="radio" name="status" ng-checked="pagedata.item.status==0" class="diy-bind" data-bind="status" > 禁用</label>
				</div>
			</div>
			
			<div class="line"></div>
			<div class="form-group">
				<div class="col-sm-2 control-label">系统模板</div>
				<div class="col-sm-10">
					<div class="temp-list temp-default">
					   
							<div ng-repeat="(k,v) in pagedata.templist"  class="item " ng-click="pagedata.templist[k].on=1;" ng-class="{'selected':pagedata.templist[k].on==1}" data-tempid="">
								<img src="{{tomedia(v.img)}}" />
							</div>
					   
					</div>
					<div class="help-block">提示：点击<span class="underline">系统模板</span>可选择使用</div>
				</div>
			</div>
		 <div class="form-group">
				<div class="col-sm-2 control-label">自定义模板</div>
				<div class="col-sm-10">
					<div class="temp-list temp-upload">
					<div  class="input-group" ng-init="checkarray(pagedata.image,'new')">
					<input type="text" class="form-control" readonly="readonly" value="" placeholder="批量上传图片" autocomplete="off">
					<span class="input-group-btn">
						<button class="btn btn-gray" type="button" ng-click="images(pagedata.img,'new');">{{check_show_lang('批量上传图片','Batch upload pictures')}}</button>
					</span>
					</div>
					<div class="input-group multi-img-details" ng-if="pagedata.img.new">
					<div class="multi-item" ng-repeat="image in pagedata.img.new track by $index">
						<img ng-click="pagedata.add(image)" data-toggle="modal" data-target="#showimage.new" ng-src="{{tomedia(image) || '../core/resource/images/nopic.jpg'}}" class="img-responsive img-thumbnail">
						<em  class="close" title="删除这张图片" ng-click="pagedata.img.new.splice($index,1)">×</em>
					</div>
					</div>		
						
					
					</div>
				</div>
			</div>
			<div class="form-group" style="margin-top: 28px;">
				<div class="col-sm-2 control-label">已选择模板</div>
				<div class="col-sm-10">
					<div class="temp-list temp-selected" id="selectedList">
					   
							<div   ng-repeat="(k,v) in pagedata.templist" ng-show="v.on==1" ng-click="pagedata.image(k)"  class="item selected" data-tempid="">
								
							   <img  src="{{tomedia(v.img)}}"  />
								
								<i style="z-index:999" class="icon icon-close" ng-click="pagedata.templist[k].on=0;" title="移除选择"></i>
								
							</div>
						
					</div>
					
				</div>
			</div>
			
			<div class="form-group">
				<div class="col-sm-2 control-label"></div>
				<div class="col-sm-10">
					<div class="btn btn-primary" ng-click="post(pagedata.item,'post')" id="btn-save">保存</div>
				</div>
			</div>
		</div>
	</div>
</div>
<div class="modal fade" id="addModal" aria-hidden="false" data-backdrop="static" data-keyboard="false">
    <div class="modal-dialog">
        <div class="modal-content">
            <div class="modal-header">
                <div class="close">×</div>
                <h4 class="modal-title">添加自定义模板</h4>
            </div>
            <div class="modal-body form-horizontal" style="padding-bottom: 0;">
                <div class="form-group">
                    <div class="col-sm-2 control-label must">缩略图</div>
                    <div class="col-sm-10">
                        <div class="image image-nail" title="选择缩略图" data-toggle="selectImage" data-input="#image-nail" data-img="#image-nail-show">
                            <img src="" id="image-nail-show" />
                            <div class="text">重新选择</div>
                            <input type="hidden" id="image-nail" />
                        </div>
                        <div class="help-block">模板缩略图，尺寸为100 * 100（尺寸不正确可能会被拉伸）</div>
                    </div>
                </div>
                <div class="form-group">
                    <div class="col-sm-2 control-label must">背景图</div>
                    <div class="col-sm-10">
                        <div class="image image-bg" title="选择背景图" data-toggle="selectImage" data-input="#image-bg" data-img="#image-bg-show">
                            <img src="" id="image-bg-show" />
                            <div class="text">重新选择</div>
                            <input type="hidden" id="image-bg" />
                        </div>
                        <div class="help-block">模板背景图，尺寸为750 * 1334（尺寸不正确可能会被拉伸）</div>
                        <div class="help-block">自定义模板元素位置请参照默认模板，图片大小尽量压缩到最小</div>
                    </div>
                </div>
            </div>
            <div class="modal-footer">
                <div class="btn btn-primary" id="btn-add">添加模板</div>
            </div>
        </div>
    </div>
</div>
</div>

<script language="javascript">
scope.pagedata.images='../addons/jy_invitation/templist/image_1_bg.jpg';
if(scope.pagedata.item.text1 !=null){
	$('#text1').html(scope.pagedata.item.text1);
}else{
	
	scope.pagedata.item.text1='向你推荐了一个商城';

}
if(scope.pagedata.item.title !=null){
	$('#yqk').html(scope.pagedata.item.title);
}else{
	$('#yqk').html('邀请卡');
}
if(scope.pagedata.item.text2 !=null){
	$('#text2').html(scope.pagedata.item.text2);
}else{
	
	scope.pagedata.item.text2=scope.pagedata.setting.title+'商城· 一个特好用的商城';
}
if(scope.pagedata.item.text3 !=null){
	$('#text3').html(scope.pagedata.item.text3);
}else{
	
	scope.pagedata.item.text3='如何做一个好的商城？';

}
scope.change = function(){
	$('#text1').html(scope.pagedata.item.text1);
	$('#text2').html(scope.pagedata.item.text2);
	$('#text3').html(scope.pagedata.item.text3);
	$('#yqk').html(scope.pagedata.item.title);
}
scope.pagedata.image = function(tempid){
	//tempid=tempid+1;
	if(tempid<10){
		tempid=tempid+1;
		scope.pagedata.images='../addons/jy_invitation/templist/image_'+tempid+'_bg.jpg';
	}else{
		scope.pagedata.images=scope.pagedata.templist[tempid].img;
	}	
}

scope.pagedata.add = function(img){
	scope.pagedata.templist.push({'on':1,'img':img});
	scope.pagedata.item.data=scope.pagedata.templist;
	//alert(JSON.stringify(scope.pagedata.templist));
}
scope.pagedata.item.data=scope.pagedata.templist;
</script>
